<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="styles.css" />
    <link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
    <script src="https://cdn.quilljs.com/1.3.6/quill.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>EditBook - 富文本编辑器</title>
    <script type="module" src="/main.js" defer></script>
  </head>

  <body>
    <div class="app-container">
      <!-- 菜单栏 -->
      <div id="menu-bar" class="menu-bar">
        <div class="menu-group">
          <button class="menu-item" data-action="new">新建</button>
          <button class="menu-item" data-action="open">打开</button>
          <button class="menu-item" data-action="save">保存</button>
          <button class="menu-item" data-action="save-as">另存为</button>
        </div>
        <div class="menu-group">
          <button class="menu-item" data-action="undo">撤销</button>
          <button class="menu-item" data-action="redo">重做</button>
        </div>
        <div class="menu-group">
          <button class="menu-item" data-action="about">关于</button>
        </div>
      </div>

      <!-- 工具栏 -->
      <div id="toolbar" class="toolbar">
        <!-- Quill 工具栏将在这里渲染 -->
      </div>

      <!-- 编辑器容器 -->
      <div class="editor-container">
        <div id="editor" class="editor">
          <!-- Quill 编辑器将在这里初始化 -->
        </div>
      </div>

      <!-- 状态栏 -->
      <div id="status-bar" class="status-bar">
        <span id="word-count">字数: 0</span>
        <span id="cursor-position">行: 1, 列: 1</span>
      </div>
    </div>
  </body>
</html>
